<!DOCTYPE html>
<html>
<head>
    {include file="public/head"}
</head>
<body>
<header class="m-navbar">
    <a href="javascript:history.back();" class="navbar-item">
        <i class="back-ico"></i>
    </a>
    <div class="navbar-center">
        <span class="navbar-title">忘记密码</span>
    </div>
</header>
<div class="g-scrollview">
    <div class="m-cell" style="margin-top: 150px;">
        <form action="/index/login/resetPassword" method="post" id="reset_form">
            <div class="cell-item">
                <div class="cell-left">手机号：</div>
                <div class="cell-right">
                    <input type="number" name="phone" pattern="[0-9]*" class="cell-input" placeholder="请输入手机号" id="phone"/>
                </div>
            </div>
            <div class="cell-item">
                <div class="cell-left">验证码：</div>
                <div class="cell-right">
                    <input type="number" pattern="[0-9]*" class="cell-input" placeholder="请输入验证码" id="code"/>
                    <button type="button" class="btn btn-warning" id="J_GetCode">获取验证码</button>
                </div>
            </div>
            <div class="cell-item">
                <div class="cell-left">密码：</div>
                <div class="cell-right">
                    <input type="password" class="cell-input" placeholder="设置新密码" name="password"/>
                </div>
            </div>
            <div class="cell-item">
                <div class="cell-left">确认密码：</div>
                <div class="cell-right">
                    <input type="password" class="cell-input" placeholder="确认新密码" name="password_2"/>
                </div>
            </div>
        </form>
        <div class="m-button">
            <button type="button" class="btn-block btn-primary" id="modify">确定</button>
        </div>
    </div>
</div>
{include file="public/js"}
<script>
    !function ($) {
        var $getCode = $('#J_GetCode');
        /* 定义参数 */
        $getCode.sendCode({
            disClass: 'btn-disabled',
            secs: 60,
            run: false,
            runStr: '{%s}s后再获取',
            resetStr: '获取验证码'
        });
        $getCode.on('click', function () {
            $this=$(this);
            /* ajax 成功发送验证码后调用【start】 */
            YDUI.dialog.loading.open('发送中');
            $.post('/api/sms/getValidateCode',{phone : $('#phone').val()},function (res) {
                dialog.loading.close();
                $this.sendCode('start');
                dialog.toast(res.msg, 'success', 1500);
            });
        });
        // 点击确定按钮
        $reg_form=$('#reset_form');
        $(document).on('click','#modify',function () {
            dialog.confirm('温馨提示','重置登录密码',function () {
                // 验证验证码的有效性
                $.post('/api/sms/validateInputCode',{phone : $('#phone').val(),'code' : $('#code').val()},function (res) {
                    if (res.state == 'success'){
                        $.post($reg_form.attr('action'),$reg_form.serialize(),function (res) {
                            dialog.toast(res.msg,'none',1000,function () {
                                location.href=res.url;
                            });
                        });
                    }else {
                        dialog.toast(res.msg,'none',1000);
                    }
                });
            });
        });
    }(jQuery);
</script>
</body>
</html>